<template>
	<view class="page">
		<!-- <view>122312</view> -->
		<view class="u-demo-block" >
			<u-swiper height="200" img-mode="scaleToFill" width="90%" @change="change" @click="click" :list="list3"
				indicator indicatorMode="line" circular></u-swiper>
		</view>
		<view class="bigbox">
			<view class="telnum">{{$t('index.tel')}}:<text style="color: gray;">{{utel}}</text></view>
			<view class="box">
				<view class="box1">
					<view>{{$t('index.telcharges')}}</view>
					<view><text class="box1_zi">{{telcharges}}</text>{{$t('app.kips')}}</view>
				</view>
				<view class="box1">
					<view>{{$t('index.flow')}}</view>
					<view><text class="box1_zi">{{flow}}</text>GB</view>
				</view>
				<view class="box1">
					<view>{{$t('index.integral')}}</view>
					<view><text class="box1_zi">{{integral}}</text>{{$t('app.kips')}}</view>
				</view>
				<view class="box1">
					<view>{{$t('index.bonus')}}</view>
					<view><text class="box1_zi">{{bonus}}</text>{{$t('app.kips')}}</view>
				</view>
			</view>
		</view>
		<view class="bigbox2">
			<view class="box">
				<view class="box1" v-for="(item,i) in menulist" @click="show(item.url)">
					<view>
						<image style="width: 30px;height: 30px;" :src="item.img"></image>
					</view>
					<view>{{item.title}}</view>
				</view>
			</view>
		</view>
	<!-- 	<luo-version-upgrade v-if="appUpgrade.upgrade" 
			:version="appUpgrade.remoteVer" :url="appUpgrade.url" 
			:describe="appUpgrade.describe" :is_force="appUpgrade.is_force">
		</luo-version-upgrade> -->
	</view>
</template>

<script>
	import { getResponseData, showToastTip,getBaseUrl,getWsUrl} from "@/api/req.js";
	import code from "../../uni_modules/uview-ui/libs/config/props/code";
	import versionUpgrade from "@/components/luo-version-upgrade/luo-version-upgrade.vue";
	export default {
		components:{
			versionUpgrade
		}, 
		data() {
			return {
				utel: '',
				current: 0,
				currentNum: 0,
				telcharges: '5000',
				flow: '5',
				integral: 0,
				bonus: 0,
				list3: [],
				menulist: [],
				appUpgrade:{
					upgrade:false,
					url:'',
					localVer:'',
					remoteVer:'',
					describe:'',
					is_force:false
				},
			}
		},
		onShow(){
			this.menulist = [{
						img: '../../static/icon/jiaofei2.png',
						title: this.$t('service.chongzhi'),
						url: '../service/recharge'
					},
					{
						img: '../../static/icon/flow2.png',
						title: this.$t('service.flow'),
						url: '../service/flow'
					},
					{
						img: '../../static/icon/SIM2.png',
						title: this.$t('service.SIM'),
						url: '../service/simka'
					},
					{
						img: '../../static/icon/zhangdan2.png',
						title: this.$t('historyzd.title'),
						url: '../service/historyzd'
					}
				]
		},
		onLoad() {
			
			this.checkNewVersion();//升级
			this.utel = uni.getStorageSync("etlSim");
			var that = this;
			// 得到用户数据
			getResponseData("/userInfo/getUserInfo", 'get',{}, function(res) {
				if (res.code == 200) {
					that.telcharges = res.data.balance;
					that.flow = ((res.data.liuliang-res.data.useLiuliang)/1024).toFixed(2);
					that.integral= res.data.jifen;
					that.bonus=res.data.bonus;
					 uni.setStorageSync("username",res.data.username);
				}else{
					uni.showToast({
						title: res.msg,
						icon: 'none',
						duration: 2000
					})
				}
			});
			// 得到首页轮播图
			getResponseData("/banner/getBannerList", 'get',{}, function(res) {
				if (res.code == 200) {
				res.data.forEach((item,index)=>{    //js遍历数组
					that.list3.push(item.images);   //push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
					});

				}else{
					
				}
			})
		},
		methods: {
			checkNewVersion(){
				//请求服务器当前版本，如果高于本版本就更新
				var version = plus.runtime.version.split("\.").join("")*1;	// 应用版本名称		
				
				const baseUrl = getBaseUrl();
				plus.runtime.getProperty(plus.runtime.appid,(wgtinfo)=>{
					var ver = wgtinfo.versionCode;	// 应用版本号	
					var verName = wgtinfo.version; //应用版本
					this.versionNo=verName+" ("+ver+")";
					getResponseData("/apk/getNewestApk",'POST',{
						pakname:'com.operator'
					},(res)=>{
						if(res.code==0){
							var newVer = res.data.versions;						
							if(newVer>ver){
								this.appUpgrade.upgrade = true;
								this.appUpgrade.remoteVer = newVer+'';
								this.appUpgrade.url=res.data.targetUrl;
								this.appUpgrade.is_force=res.data.forceUpgradeFlag==1;
								this.appUpgrade.describe = res.data.newContent;
							}else{
								
							}
						}
					})
				})
			},
			change(e) {
				// console.log('change', e);
			},
			click(e) {
				console.log('click', e);
			},
			show(url) {
				uni.navigateTo({
					url: url
				})
			}

		},
	}
</script>
<style>
	page {
		background-image: linear-gradient(to bottom, #016fb6, #e1f3ff);
		/* height: 100vh; */
		height: 100%;
	}

	.bigbox {
		background-color: white;
		width: 90%;
		margin: 10px auto;
		border-radius: 5px;
	}

	.bigbox2 {
		background-color: white;
		width: 90%;
		margin: 10px auto;
		border-radius: 5px;
		/* 	position: fixed;
      bottom: var(--window-bottom, 0);
	  left: 18px; */
	}


	.telnum {
		padding-left: 10px;
		padding-top: 10px;
		font-size: 16px;
		font-weight: 600;
	}

	.box {
		display: flex;
		justify-content: space-around;
		flex-wrap: wrap;
	}

	.box1 {
		margin: 10px 0px;
		width: 40%;
		text-align: center;
	}

	.box1>view {
		color: gray;
		font-size: 16px;
		line-height: 30px;
	}

	.box1_zi {
		font-size: 20px;
		color: black !important;
		line-height: 20px;
	}
</style>